import React ,{Suspense}from 'react'
import {
    BrowserRouter,
    Route,
    Routes,
    Navigate
} from 'react-router-dom'
import routes from "./routerConfig"

interface MYPROPS{
    
}

interface ROUTERITEM{
    path:string;
    element?:any;
    children?:ROUTERITEM[];
    to?:string;
}

function router(props:MYPROPS) {
    const renderRouter=(routes:Array<ROUTERITEM>)=>{
        return routes.map((item:ROUTERITEM,index:number)=>{
            return <Route key={index} path={item.path} element={item.to?<Navigate to={item.to} /> : <item.element/>}>
                {
                    item.children&&renderRouter(item.children)
                }
            </Route>
        })
    }
    return (
        <Suspense fallback={<div>路由加载中...</div>}>
            <BrowserRouter>
                <Routes>
                    {
                        renderRouter(routes)
                    }
                </Routes>
            </BrowserRouter>
        </Suspense>
    )
}

export default router